import React from 'react';
import { toJS } from 'mobx';
import { WeaTools } from 'ecCom';
import { inject, observer } from 'mobx-react';
import { Button } from 'antd';
import { WeaRightMenu, WeaTop, WeaTab, WeaLocaleProvider } from 'ecCom';

const getLabel = WeaLocaleProvider.getLabel;

@inject('smsRadioStore')
@observer
class RadioDetail extends React.Component {
    constructor(props) {
        super(props);
    }

    componentDidMount() {
        const { smsRadioStore } = this.props;
        const { getPcRadioDetail } = smsRadioStore;

        let url = window.location.href;
        let param = '';
        url = url.split('?');
        if (url[1]) {
            url = url[1].split('&');
            url = url[0].split('=');
            param = url[1];
        }
        getPcRadioDetail(param);
    }
    // 渲染流程业务数据
    renderWorkFlowBiz = () => {
        const { smsRadioStore } = this.props;
        const { workFlowBiz } = smsRadioStore;

        if (workFlowBiz) {
            return workFlowBiz.map((val, index) => {
                let valHtml = `<a contenteditable='false' onclick="window.open('/common/chatResource/view.html?resourcetype=0&resourceid=${val.bizid}&isfromchatshare=1&sharer=${val.bizcreater}')"` +
                    'href="javascript:void(0);" unselectable="off" contenteditable="false"' +
                    'style="cursor:pointer;text-decoration:none !important;margin-right:8px">' +
                    `${val.bizname}</a>&nbsp;</br>`;
                return (
                    <div className={index == 0 ? 'container-content-Workflow' : 'container-content-Workflow-n'} dangerouslySetInnerHTML={{ __html: valHtml }} />
                );
            });
        }
    }
    // 渲染文档业务数据
    renderDocBiz = () => {
        const { smsRadioStore } = this.props;
        const { docBiz } = smsRadioStore;

        if (docBiz) {
            return docBiz.map((val, index) => {
                let valHtml = `<a contenteditable='false' onclick="ecCom.WeaRichText.openAppLink(this,${val.bizid},37)"` +
                    'href="javascript:void(0);" unselectable="off" contenteditable="false"' +
                    'style="cursor:pointer;text-decoration:none !important;margin-right:8px">' +
                    `${val.bizname}</a>&nbsp;</br>`;
                return (
                    <div className={index == 0 ? 'container-content-Workflow' : 'container-content-Workflow-n'} dangerouslySetInnerHTML={{ __html: valHtml }} />
                );
            });
        }
    }
    // 渲染附件业务数据
    renderFileBiz = () => {
        const { smsRadioStore } = this.props;
        const { fileBiz } = smsRadioStore;
        if (fileBiz) {
            return fileBiz.map((val, index) => {
                let valHtml = `<a onclick="ecCom.WeaRichText.openAppLink(this,${val.bizid},37)" unselectable="off"` +
                    'style="cursor:pointer;text-decoration:none !important;margin-right:8px"' +
                    `href="javascript:void(0);" contenteditable="false">${val.bizname}</a>&nbsp;<a unselectable='off' contenteditable='false'` +
                    `href='javascript:window.open(\"${val.loadlink}\");void(0)' ` +
                    `style='cursor:pointer;text-decoration:none;margin-right:8px'>下载(${val.filesize})</a>&nbsp;</br>`;
                return (
                    <div className={index == 0 ? 'container-content-Workflow' : 'container-content-Workflow-n'} dangerouslySetInnerHTML={{ __html: valHtml }} />
                );
            });
        }
    }

    render() {
        const { smsRadioStore } = this.props;
        const { loading, workFlowBiz, docBiz, fileBiz, msgDialogItem } = smsRadioStore;

        return (
            <div className="sms-detail">
                <WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@ijlu7f`}
                  collectParams={{
                        favname: getLabel(514516, '广播详情'),
                        favouritetype: 5,
                        objid: 0,
                        importantlevel: 1,
                    }}
                >
                    <WeaTop ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@fa07nu`}
                      loading={loading}
                      title={getLabel(514516, '广播详情')}
                      icon={<i className="icon-coms02-top-news2" />}
                      iconBgcolor="#0079de"
                      buttonSpace={10}
                      showDropIcon={true}
                      dropMenuDatas={[{ disabled: true }]}
                    >
                        <div className="sms-radio-detail">
                            <div className="sms-radio-detail-container">
                                <div className="container-head">
                                    <div className="container-title">{msgDialogItem.title}</div>
                                    <div className="container-info">
                                        <div className="container-sendInfo">
                                            <span>{msgDialogItem.creater}</span>
                                            <span className="container-time">{msgDialogItem.createdate}  {msgDialogItem.createtime}</span>
                                        </div>
                                    </div>
                                </div>
                                <div className="container-content" dangerouslySetInnerHTML={{ __html: msgDialogItem.contexts }} />
                                <div className="container-content" style={{ display: fileBiz.length > 0 ? 'block' : 'none' }}>
                                    <span className="icon-coms-currency-Enclosure" title="附件" />
                                    {this.renderFileBiz()}
                                </div>
                                <div className="container-content" style={{ display: docBiz.length > 0 ? 'block' : 'none' }}>
                                    <span className="icon-coms-Journal" title="文档" />
                                    {this.renderDocBiz()}
                                </div>
                                <div className="container-content" style={{ display: workFlowBiz.length > 0 ? 'block' : 'none' }}>
                                    <span className="icon-portal-Workflow-o" title="流程" />
                                    {this.renderWorkFlowBiz()}
                                </div>
                            </div>
                        </div>
                    </WeaTop>

                </WeaRightMenu>
            </div>
        );
    }
}

export default RadioDetail;
